<%@ page contentType="text/html; charset=UTF-8" session="false"%>
<%@ include file="/WEB-INF/jspf/import.jspf"%>
<div class="pageContent">
    <br />
    <span id="title">等级与积分配置</span>
    <hr />
    <div layouth="60" style="height: 366px; overflow: auto;">
        <div id="integral-div" style="background-color: #E8E8E8; margin: 10px 0px  15px  10px; width: 98%;">
            <span id="integration">积分配置</span><br>
            <table>
                <thead>
                    <tr>
                        <td>积分名称</td>
                        <td>油值数</td>
                        <td></td>
                    </tr>
                </thead>
                <tbody>
                    <tr style="display: none" id="tr-addIntegral">
                        <td width="49%"><input type="text" id="integralName"></td>
                        <td><input type="text" id="petrol"></td>
                        <td><a href="javascript:;" onclick="addIntegral();">提交</a></td>
                    </tr>
                    <c:forEach items="${integrals}" var="i" varStatus="s">
                        <tr id="update-integral-${i.integralId}">
                            <td>${s.count}.<input type="text" size="60" value="${i.name}"  readOnly="true" onkeydown="if (event.keyCode == 13) {editIntegral('${i.integralId}');}"></td>
                            <td><input type="text" value="${i.petrol}" onkeydown="if (event.keyCode == 13) {editIntegral('${i.integralId}');}"></td>
                            <td>
                                <a href="javascript:;" onclick="editIntegral('${i.integralId}')">修改</a>
                            </td>
                        </tr>
                    </c:forEach>
                </tbody>
            </table>
        </div>
        <!-- div id="level-div" style="width: 55%; float: right; position:relative ">
            <span id="level">等级配置</span>
            <span id="info" style="margin-left: 25px; color: red; font-size: 25px;"></span><br>
            <table>
                <thead>
                    <tr>
                        <td>等级名称</td>
                        <td>积分（油值）要求</td>
                        <td>认证数要求</td>
                        <td>
                        </td>
                    </tr>
                </thead>
                <tbody>
                    <tr style="display: none" id="tr-addLevel">
                        <td><input type="text" id="levelName"></td>
                        <td><input type="text" id="levelPetrol"></td>
                        <td><input type="text" id="levelMember"></td>
                        <td><a href="javascript:;" onclick="addLevel();">提交</a></td>
                    </tr>
                    <c:forEach items="${levels}" var="o" varStatus="s">
                        <tr id="update-level-${o.levelId}">
                            <td><input type="text" value="${o.levelName}" onkeydown="if (event.keyCode == 13) {editLevel('${o.levelId}');}"></td>
                            <td><input type="text" value="${o.levelPetrol}" onkeydown="if (event.keyCode == 13) {editLevel('${o.levelId}');}"></td>
                            <td><input type="text" value="${o.levelMember}" onkeydown="if (event.keyCode == 13) {editLevel('${o.levelId}');}"></td>
                            <td>
                                <a href="javascript:;" onclick="editLevel('${o.levelId}')">修改</a>
                            </td>
                        </tr>
                    </c:forEach>
                </tbody>
            </table>
        </div-->
    </div>
</div>
<script>
    (function($){
        $('#title').attr('style', 'font-size:20px; color:blue; padding:5px');
        $('#integration').attr('style', 'font-size:18px; color:blue; padding:5px');
        $('#level').attr('style', 'font-size:18px; color:blue; padding:5px');
		
        $('table').attr('style', 'padding:10px; width:100%;');
        $('thead tr td').attr('style', 'font-size:15px; padding-bottom:10px');
        $('td').attr('style', 'font-size: 15px; padding: 5px');
        $('tr:odd').css('background-color', '#D8FEFF');
	
        // 回车事件
        $('#levelName, #levelPetrol, #levelMember')
        .bind('keyup', function(event) {
            if (event.keyCode == 13) {
                addLevel();
            }
        });

        $('#integralName, #petrol')
        .bind('keyup', function(event) {
            if (event.keyCode == 13) {
                addIntegral();
            }
        });
    })(jQuery);
	
    function checkNum(num) {
        return num.match("/\D/") == null;
    }
	
    function checkFloatNum(num) {
        return num.match("/^[0-9]+.?[0-9]*$/") == null;
    }
	
    function checkIntegral(name, petrol) {
        if (name == '' || name == null) {
            alert('积分名称不能为空!');
            return false;
        }
		
        if (petrol == '' || !checkFloatNum(petrol)) {
            alert('油值必须为数字!');
            return false;
        }
		
        return true;
    }
	
    // 积分配置--添加
    function addIntegral() {
        var name = $("#integralName").val();
        var petrol = $("#petrol").val();
		
        if (!checkIntegral(name, petrol)) {
            return;
        }
		
        $.post("/admin/club/addIntegral.do",
        {
            name: name,
            petrol: petrol
        },
        function(data) {
            if (data.statusCode == 200) {
                return navTabSearch(this);
            }
        }, 'json');
    }
	
    // 积分配置--修改
    function editIntegral(id) {
        var array = [];
        $('#update-integral-' + id + ' td input').each(function(i) {
            array[i] = $(this).val();
        });
		
        if (!checkIntegral(array[0], array[1])) {
            return;
        }
		
        $.post("/admin/club/updateIntegral.do",
        {
            integralId: id,
            name: array[0],
            petrol: array[1]
        },
        function(v){
            alert(v.message);
            if (v.statusCode == 200) {
                return navTabSearch(this);
            }
        },'json');
    }
	
    function checkLevelValue(levelName, levelPetrol, levelMember) {
        if (levelName == '' || levelName == null) {
            alert('等级名称不能为空!');
            return false;
        }
		
        if (levelPetrol == '' || !checkNum(levelPetrol)) {
            alert('积分必须为整数!');
            return false;
        }
		
        if (levelMember == '' || !checkNum(levelMember)) {
            alert('认证数必须为整数!');
            return false;
        }
		
        return true;
    }
	
    // 车友会等级配置--添加
    function addLevel() {
        var levelName = $('#levelName').val();
        var levelPetrol = $('#levelPetrol').val();
        var levelMember = $('#levelMember').val();
		
        if (!checkLevelValue(levelName, levelPetrol, levelMember)) {
            return;
        }
		
        $.post("/admin/club/addLevel.do", 
        {
            levelName: levelName,
            levelPetrol: levelPetrol,
            levelMember: levelMember
        }, 
        function(data){
            if (data.statusCode == 200) {
                return navTabSearch(this);
            }
            $("#info").text(data.message).show();
        }, 'json');
    }
	
    // 车友会等级配置--修改
    function editLevel(levelId) {
        var array = [];
        $('#update-level-' + levelId + ' td input').each(function(i) {
            array[i] = $(this).val();
        });
		
        if (!checkLevelValue(array[0], array[1], array[2])) {
            return;
        }
		
        $.post("/admin/club/updateLevel.do",
        {
            levelId: levelId,
            levelName: array[0],
            levelPetrol: array[1],
            levelMember: array[2]
        },
        function(v){
            $("#info").text(v.message).show();
            setTimeout(function () {  
                if (v.statusCode == 200) {
                    return navTabSearch(this);
                }
            }, 2000); 
        },'json');
    }	
</script>